<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
	    <meta name="apple-mobile-web-app-capable" content="yes">
	    <meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="libs/sm.css" />
		<script type='text/javascript' src='https://g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
		<script type='text/javascript' src='https://g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>
		<script src="https://cdn.jsdelivr.net/npm/vue"></script>
		<style>
			.page {
				background-color: white;
			}
			.item {
				width: calc(100% - 0.5rem);
				margin-left: 0.25rem;
				height: 3.5rem;
				border-bottom: solid 0.05rem #efeff4;
			}
			.item img {
				width: 3rem;
				height: 3rem;
				margin: 0.25rem;
				float: left;
			}
			.item div {
				float: left;
				height: 3.5rem;
				line-height: 3.5rem;
			}
		</style>
	</head>
	<body class="page">
		<div class="content" id="app">
			<div class="item" v-for="item in kefus" @click="itemClick(item.href)">
				<img v-bind:src="item.header_image" />
				<div>{{item.nickname}}</div>
			</div>
		</div>
	</body>
	<script>
		var app = new Vue({
			el: '#app',
			data: {
				kefus: [],
			},
			mounted: function() {
				this.getData();
			},
			methods: {
				getData: function(){
		      		var self = this;
		      		$.ajax({
		      			type:"get",
		      			url:"https://api.hgdqdev.cn/jingfei/list_user",
		      			async:true,
		      			success: function(res){
		      				if (res.status == 100) {
		      					self.kefus = res.data;
		      				} else{
		      					self.$message.error('获取失败');
		      				}
		      			},
		      			error: function(){
		      				self.$message.error('网络连接失败，请稍后重试');
		      			}
		      		});
	      		},
				itemClick: function(href){
					window.location.href = href;
				}
			}
		})
	</script>
</html>
